<template>
  <div class="WorkingSchedule" v-loading="loading">
    <el-form ref="form" :model="form" label-position="top" class="myform">
      <div>
        <el-form-item label="合同编号:" class="myform-item">
          <el-input
            v-model="form.factory_contract_no"
            placeholder="请输入合同编号"
            clearable
            @keyup.enter.native="onSearch"
          ></el-input>
        </el-form-item>
        <el-form-item label="工厂名:" class="myform-item">
          <el-input
            v-model="form.factory_name"
            placeholder="请输入工厂名"
            clearable
            @keyup.enter.native="onSearch"
          ></el-input>
        </el-form-item>
        <el-form-item label="审核状态:" class="myform-item">
          <el-select
            v-model="form.status"
            placeholder="请选择"
            clearable
            @keyup.enter.native="onSearch"
          >
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="是否生成:" class="myform-item">
          <el-select
            v-model="form.s_status"
            placeholder="请选择"
            clearable
            @keyup.enter.native="onSearch"
          >
            <el-option
              v-for="item in optionsgenerate"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
      </div>
      <div>
        <el-form-item style="margin-top: 50px">
          <el-button type="primary" @click="onSearch">查询</el-button>
        </el-form-item>
      </div>
    </el-form>
    <el-table :data="tableData" style="width: 100%" border>
      <el-table-column
        label="合同编号"
        align="center"
        prop="factory_contract_no"
      ></el-table-column>
      <el-table-column
        label="工厂"
        align="center"
        prop="factory_name"
      ></el-table-column>
      <el-table-column
        label="加工单号"
        align="center"
        prop="processing_code"
      ></el-table-column>
      <el-table-column
        label="合同金额"
        align="center"
        prop="contract_amount"
      ></el-table-column>
      <el-table-column
        label="总件数"
        align="center"
        prop="totalnum"
      ></el-table-column>
      <el-table-column label="预付款" align="center" prop="advance_amount">
        <template slot-scope="{ row }">
          <el-link
            target="_blank"
            type="primary"
            :disabled="row.advance_amount <= 0"
            @click="onDetailList(row.factory_contract_no, 0)"
            >{{ row.advance_amount }}</el-link
          >
        </template>
      </el-table-column>
      <el-table-column label="违约金/赔偿金" align="center" prop="fine_amount">
        <template slot-scope="{ row }">
          <el-link
            target="_blank"
            type="primary"
            :disabled="row.fine_amount <= 0"
            @click="onDetailList(row.factory_contract_no, 1)"
            >{{ row.fine_amount }}</el-link
          >
        </template>
      </el-table-column>
      <el-table-column label="额外费用" align="center" prop="additional_amount">
        <template slot-scope="{ row }">
          <el-link
            target="_blank"
            type="primary"
            :disabled="row.additional_amount <= 0"
            @click="onDetailList(row.factory_contract_no, 2)"
            >{{ row.additional_amount }}</el-link
          >
        </template>
      </el-table-column>
      <el-table-column label="工序加工费" align="center" prop="work_amount">
        <template slot-scope="{ row }">
          <el-link
            target="_blank"
            type="primary"
            :disabled="row.work_amount <= 0"
            @click="onDetailList(row.factory_contract_no, 3)"
            >{{ row.work_amount }}</el-link
          >
        </template>
      </el-table-column>
      <el-table-column
        label="生成时间"
        align="center"
        prop="ti_time"
      ></el-table-column>
      <el-table-column
        label="理单员"
        align="center"
        prop="order_processor"
      ></el-table-column>
      <el-table-column label="状态" align="center" prop="status">
        <template slot-scope="{ row }">
          <div
            :style="{
              color:
                row.status == 3 || row.status == 4
                  ? 'red'
                  : row.status == 2
                  ? '#67C23A'
                  : row.status == 1
                  ? '#F7C443'
                  : '',
            }"
          >
            {{
              row.status == 0
                ? "未提交"
                : row.status == 1
                ? "待审核"
                : row.status == 2
                ? "已通过"
                : row.status == 3
                ? "未通过"
                : row.status == 4
                ? "已作废"
                : ""
            }}
          </div>
          <el-button
            type="text"
            @click="onLookContract(row.fileid)"
            v-if="row.s_status == 1 && row.status == 2"
            >查看合同附件</el-button
          >
        </template>
      </el-table-column>
      <el-table-column label="申请" align="center">
        <template slot-scope="{ row }">
          <!-- <el-button
            type="text"
            size="default"
            @click="onImprest(row)"
            v-if="(!row.advance_amount && row.status == 2) && qxobj.save"
            >预付款</el-button
          > -->
          <el-button
            type="text"
            size="default"
            @click="onWorkingProcedure(row)"
            v-if="(row.status == 2) && qxobj.save"
            >工序加工</el-button
          >
          <el-button
            type="text"
            size="default"
            @click="onPenalty(row)"
            v-if="(row.status == 2) && qxobj.save"
            >违约金/赔偿金</el-button
          >
          <el-button
            type="text"
            size="default"
            @click="onExtra(row)"
            v-if="(row.status == 2) && qxobj.save"
            >额外费用</el-button
          >
        </template>
      </el-table-column>

      <el-table-column label="操作" align="center">
        <template slot-scope="{ row }">
          <el-button type="text" size="default" @click="onLook(row.id)" v-if="row.status != 4">查看</el-button>
          <el-button type="text" v-if="(row.status == 0) && qxobj.save" size="default" @click="onSubmit(row)">提交</el-button>
          <el-button type="text" v-if="(row.status == 1) && qxobj.save" size="default" @click="onAudit(row)">审核</el-button>
          <el-button type="text" style="color: red" size="default" @click="onCancellation(row)" v-if="(row.status == 0 || row.status == 1) && qxobj.save">作废</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      :form="form"
      :total="total"
      @paginationPostOrderTaskList="postAdminPricingGetEmbroideryContract"
    />
    <!-- 审核 -->
    <el-dialog title="审核" :visible.sync="auditdialogVisible" :lose-on-click-modal="false" width="30%">
      <div>
        <el-radio v-model="auditForm.status" :label="1">通过</el-radio>
        <el-radio v-model="auditForm.status" :label="0">拒绝</el-radio>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="auditdialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="onAuditAffirm">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 违约金/赔偿金 -->
    <el-dialog title="违约金/赔偿金申请" :visible.sync="penaltydialogVisible" :lose-on-click-modal="false" width="30%">
      <el-form
        :model="penaltyForm"
        :rules="rulespenaltyForm"
        ref="penaltyForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="合同编号">
          <el-input
            v-model="penaltyForm.factory_contract_no"
            disabled
          ></el-input>
        </el-form-item>
        <el-form-item label="款号" prop="type_no">
          <el-select v-model="penaltyForm.type_no" placeholder="请选择款号">
            <el-option
              v-for="(item, index) in contracttypenolist"
              :key="index"
              :label="item.type_no"
              :value="item.type_no"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="违约金/赔偿金原因" prop="reason">
          <el-select
            v-model="penaltyForm.reason"
            placeholder="请选择违约金/赔偿金原因"
          >
            <el-option
              v-for="(item, index) in reasonList"
              :key="index"
              :label="item.title"
              :value="item.title"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="违约金/赔偿金金额" prop="amount">
          <el-input
            v-model="penaltyForm.amount"
            type="number"
            placeholder="请输入违约金/赔偿金金额"
          ></el-input>
        </el-form-item>
        <el-form-item label="违约金/赔偿金备注" prop="remarks">
          <el-input
            v-model="penaltyForm.remarks"
            type="textarea"
            placeholder="请输入违约金/赔偿金备注"
          ></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="penaltydialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="onPenaltyAffirm('penaltyForm')"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!-- 额外费用申请 -->
    <el-dialog title="额外费用申请" :visible.sync="extradialogVisible" :lose-on-click-modal="false" width="30%">
      <el-form
        :model="extraForm"
        :rules="rulesextraForm"
        ref="extraForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="合同编号">
          <el-input v-model="extraForm.factory_contract_no" disabled></el-input>
        </el-form-item>
        <el-form-item label="款号" prop="type_no">
          <el-select
            v-model="extraForm.type_no"
            placeholder="请选择款号"
            @change="onChangeType($event, 1)"
          >
            <el-option
              v-for="(item, index) in contracttypenolist"
              :key="index"
              :label="item.type_no"
              :value="item"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="品名">
          <el-input
            v-model="extraForm.product_name"
            placeholder="根据款号自动获取"
            disabled
          ></el-input>
        </el-form-item>
        <el-form-item label="用途" prop="purpose">
          <el-select v-model="extraForm.purpose" placeholder="请选择用途">
            <el-option
              v-for="(item, index) in purposenList"
              :key="index"
              :label="item.title"
              :value="item.title"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="单价" prop="price">
          <el-input
            @change="onChangePrice(1)"
            v-model="extraForm.price"
            type="number"
            placeholder="请输入单价"
          ></el-input>
        </el-form-item>
        <el-form-item label="数量" prop="num">
          <el-input
            @change="onChangePrice(1)"
            v-model="extraForm.num"
            type="number"
            placeholder="请输入数量"
          ></el-input>
        </el-form-item>
        <el-form-item label="税率" prop="tax_rate">
          <el-input
            @change="onChangePrice(1)"
            v-model="extraForm.tax_rate"
            type="number"
            placeholder="例如：10个点则输入10"
          >
            <template slot="append">%</template>
          </el-input>
        </el-form-item>
        <el-form-item label="总价">
          <el-input
            v-model="extraForm.amount"
            type="number"
            placeholder="总价"
            disabled
          ></el-input>
        </el-form-item>
        <el-form-item label="上传凭证" prop="images">
          <div class="avatar-uploader-list">
            <div v-if="extraForm.images.length">
              <div
                class="avatar-uploader-list-div"
                @mouseenter="enter(index)"
                @mouseleave="leave()"
                v-for="(item, index) in extraForm.images"
                :key="index"
              >
                <el-image
                  :src="item"
                  class="avatar-uploader-list-image"
                ></el-image>
                <div
                  class="avatar-uploader-list-div-shade"
                  v-if="mouseIndex == index"
                >
                  <!-- <i class="el-icon-zoom-in" style="color:#fff;font-size:30px;margin:0 10px"></i> -->
                  <i
                    class="el-icon-delete"
                    style="color: #fff; font-size: 30px; margin: 0 10px"
                    @click="onDelete(index)"
                  ></i>
                </div>
              </div>
            </div>
            <el-upload
              class="avatar-uploader"
              action="/"
              :before-upload="beforeAvatarUpload"
            >
              <i class="el-icon-plus avatar-uploader-icon"></i>
            </el-upload>
          </div>
        </el-form-item>
        <el-form-item label="备注" prop="remarks">
          <el-input
            v-model="extraForm.remarks"
            type="textarea"
            placeholder="请输入备注"
          ></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="extradialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="onExtraAffirm('extraForm')"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!-- 预付款申请 -->
    <el-dialog title="预付款申请" :visible.sync="imprestdialogVisible" :lose-on-click-modal="false" width="30%">
      <el-form
        :model="imprestForm"
        ref="imprestForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="合同编号">
          <el-input
            v-model="imprestForm.factory_contract_no"
            disabled
          ></el-input>
        </el-form-item>

        <el-form-item label="合同金额">
          <el-input
            v-model="imprestForm.contract_amount"
            placeholder="合同金额"
            disabled
          ></el-input>
        </el-form-item>
        <el-form-item label="预付款比例">
          <el-input
            v-model="imprestForm.proportion"
            placeholder="请输入预付款比例"
            disabled
          ></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="imprestdialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="onImprestAffirm">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 工序费用 -->
    <el-dialog title="工序费用申请" :visible.sync="workingProceduredialogVisible" :lose-on-click-modal="false" width="30%">
      <el-form
        :model="workingProcedureForm"
        :rules="rulesworkingProcedureForm"
        ref="workingProcedureForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="合同编号">
          <el-input
            v-model="workingProcedureForm.factory_contract_no"
            disabled
          ></el-input>
        </el-form-item>
        <el-form-item label="加工厂" class="myform-item">
          <el-select
            v-model="workingProcedureForm.supplier_id"
            placeholder="请选择"
          >
            <el-option
              v-for="item in factoryList"
              :key="item.supplier_id"
              :label="item.factory_name"
              :value="item.supplier_id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="款号" prop="type_no">
          <el-select
            v-model="workingProcedureForm.type_no"
            placeholder="请选择款号"
            @change="onChangeType($event, 2)"
          >
            <el-option
              v-for="(item, index) in contracttypenolist"
              :key="index"
              :label="item.type_no"
              :value="item"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="单价" prop="price">
          <el-input
            @change="onChangePrice(2)"
            v-model="workingProcedureForm.price"
            type="number"
            placeholder="请输入单价"
          ></el-input>
        </el-form-item>
        <el-form-item label="数量" prop="num">
          <el-input
            @change="onChangePrice(2)"
            v-model="workingProcedureForm.num"
            type="number"
            placeholder="请输入数量"
          ></el-input>
        </el-form-item>
        <el-form-item label="总价">
          <el-input
            v-model="workingProcedureForm.amount"
            type="number"
            placeholder="总价"
            disabled
          ></el-input>
        </el-form-item>
        <el-form-item label="交期" prop="delivery_date">
          <el-date-picker
            value-format="yyyy-MM-dd"
            v-model="workingProcedureForm.delivery_date"
            type="date"
            placeholder="选择日期"
          ></el-date-picker>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="workingProceduredialogVisible = false"
          >取 消</el-button
        >
        <el-button
          type="primary"
          @click="onWorkingProcedureAffirm('workingProcedureForm')"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <el-dialog :title="detaillistype | detailTilte" :visible.sync="detaillistdialogVisible" :lose-on-click-modal="false" destroy-on-close width="60%">
      <!-- 预付款 -->
      <div v-if="detaillistype == 0">
        <el-table
          :data="detaillisttableData"
          style="width: 100%"
          border
          v-if="detaillistype == 0"
        >
          <el-table-column
            label="创建人"
            align="center"
            prop="adduser"
          ></el-table-column>
          <el-table-column
            label="合同编号"
            align="center"
            prop="factory_contract_no"
          ></el-table-column>
          <el-table-column
            label="工厂"
            align="center"
            prop="factory_name"
          ></el-table-column>
          <el-table-column
            label="合同金额"
            align="center"
            prop="contract_amount"
          ></el-table-column>
          <el-table-column
            label="预付款"
            align="center"
            prop="amount"
          ></el-table-column>
          <el-table-column
            label="申请时间"
            align="center"
            prop="createtime"
          ></el-table-column>
          <el-table-column label="付款状态" align="center" prop="k_status">
            <template slot-scope="{ row }">
              <div
                :style="{
                  color: row.k_status != 0 ? '#67C23A' : '',
                }"
              >
                {{
                  row.k_status == 0
                    ? "未付款"
                    : row.k_status == 1
                    ? "已付款"
                    : row.k_status == 2
                    ? "已抵扣"
                    : ""
                }}
              </div>
            </template>
          </el-table-column>
          <el-table-column
            label="凭证图片"
            align="center"
            prop="createtime"
            width="150"
          >
            <template slot-scope="{ row }">
              <el-image
                :src="row.images"
                v-if="row.images"
                fit="fill"
                :lazy="true"
                :preview-src-list="[row.images]"
              ></el-image>
            </template>
          </el-table-column>
          <el-table-column
            label="付款日期"
            align="center"
            prop="pay_time"
          ></el-table-column>
          <el-table-column label="审核状态" align="center" prop="status">
            <template slot-scope="{ row }">
              <div
                :style="{
                  color:
                    row.status == 1 ? '#67C23A' : row.status == 2 ? 'red' : '',
                }"
              >
                {{
                  row.status == 0
                    ? "未审核"
                    : row.status == 1
                    ? "通过"
                    : row.status == 2
                    ? "未通过"
                    : ""
                }}
              </div>
            </template>
          </el-table-column>
        </el-table>
      </div>

      <!-- 违约金/赔偿金 -->
      <div v-if="detaillistype == 1">
        <el-table :data="detaillisttableData" style="width: 100%" border>
          <el-table-column
            label="创建人"
            align="center"
            prop="adduser"
          ></el-table-column>
          <el-table-column
            label="工厂"
            align="center"
            prop="factory_name"
          ></el-table-column>
          <el-table-column
            label="合同号"
            align="center"
            prop="factory_contract_no"
          ></el-table-column>
          <el-table-column
            label="款号"
            align="center"
            prop="type_no"
          ></el-table-column>
          <el-table-column
            label="违约金/赔偿金金额"
            align="center"
            prop="amount"
          ></el-table-column>
          <el-table-column
            label="违约金/赔偿金原因"
            align="center"
            prop="reason"
          ></el-table-column>
          <el-table-column label="扣款状态" align="center" prop="k_status">
            <template slot-scope="{ row }">
              <div
                :style="{
                  color: row.k_status != 0 ? '#67C23A' : '',
                }"
              >
                {{
                  row.k_status == 0
                    ? "未扣款"
                    : row.k_status == 1
                    ? "未扣款"
                    : row.k_status == 2
                    ? "已扣款"
                    : ""
                }}
              </div>
            </template>
          </el-table-column>
          <el-table-column
            label="违约金/赔偿金申请日期"
            align="center"
            prop="createtime"
          ></el-table-column>
          <el-table-column
            label="违约金/赔偿金日期"
            align="center"
            prop="kou_time"
          ></el-table-column>
          <el-table-column
            label="违约金/赔偿金理由"
            align="center"
            prop="remarks"
          ></el-table-column>
          <el-table-column label="审核状态" align="center" prop="status">
            <template slot-scope="{ row }">
              <div
                :style="{
                  color:
                    row.status == 1 ? '#67C23A' : row.status == 2 ? 'red' : '',
                }"
              >
                {{
                  row.status == 0
                    ? "未审核"
                    : row.status == 1
                    ? "通过"
                    : row.status == 2
                    ? "未通过"
                    : ""
                }}
              </div>
            </template>
          </el-table-column>
        </el-table>
      </div>

      <!-- 额外费用 -->
      <div v-if="detaillistype == 2">
        <el-table :data="detaillisttableData" style="width: 100%" border>
          <el-table-column
            label="创建人"
            align="center"
            prop="adduser"
          ></el-table-column>
          <el-table-column
            label="工厂"
            align="center"
            prop="factory_name"
          ></el-table-column>
          <el-table-column
            label="合同编号"
            align="center"
            prop="factory_contract_no"
          ></el-table-column>
          <el-table-column
            label="款号"
            align="center"
            prop="type_no"
          ></el-table-column>
          <el-table-column
            label="品名"
            align="center"
            prop="product_name"
          ></el-table-column>
          <el-table-column
            label="用途"
            align="center"
            prop="purpose"
          ></el-table-column>
          <el-table-column
            label="单价"
            align="center"
            prop="price"
          ></el-table-column>
          <el-table-column
            label="数量"
            align="center"
            prop="num"
          ></el-table-column>
          <el-table-column
            label="总价"
            align="center"
            prop="amount"
          ></el-table-column>
          <el-table-column
            label="凭证"
            align="center"
            prop="images"
            width="150"
          >
            <template slot-scope="{ row }">
              <el-image
                :src="row.images"
                v-if="row.images"
                fit="fill"
                :lazy="true"
                :preview-src-list="[row.images]"
              ></el-image>
            </template>
          </el-table-column>
          <el-table-column
            label="备注"
            align="center"
            prop="remarks"
          ></el-table-column>
          <el-table-column label="使用状态" align="center" prop="k_status">
            <template slot-scope="{ row }">
              <div
                :style="{
                  color: row.k_status != 0 ? '#67C23A' : '',
                }"
              >
                {{
                  row.k_status == 0
                    ? "未付款"
                    : row.k_status == 1
                    ? "已付款"
                    : row.k_status == 2
                    ? "已抵扣"
                    : ""
                }}
              </div>
            </template>
          </el-table-column>
          <el-table-column label="审核状态" align="center" prop="status">
            <template slot-scope="{ row }">
              <div
                :style="{
                  color:
                    row.status == 1 ? '#67C23A' : row.status == 2 ? 'red' : '',
                }"
              >
                {{
                  row.status == 0
                    ? "未审核"
                    : row.status == 1
                    ? "通过"
                    : row.status == 2
                    ? "未通过"
                    : ""
                }}
              </div>
            </template>
          </el-table-column>
        </el-table>
      </div>

      <!-- 工序 -->
      <div v-if="detaillistype == 3">
        <el-table :data="detaillisttableData" style="width: 100%" border>
          <el-table-column
            label="创建人"
            align="center"
            prop="adduser"
          ></el-table-column>
          <el-table-column
            label="工序加工单"
            align="center"
            prop="working_number"
          ></el-table-column>
          <el-table-column
            label="合同号"
            align="center"
            prop="factory_contract_no"
          ></el-table-column>
          <el-table-column
            label="款号"
            align="center"
            prop="type_no"
          ></el-table-column>
          <el-table-column
            label="工厂"
            align="center"
            prop="factory_name"
          ></el-table-column>
          <el-table-column
            label="单价"
            align="center"
            prop="price"
          ></el-table-column>
          <el-table-column
            label="数量"
            align="center"
            prop="num"
          ></el-table-column>
          <el-table-column
            label="金额"
            align="center"
            prop="amount"
          ></el-table-column>
          <el-table-column
            label="交期"
            align="center"
            prop="delivery_date"
          ></el-table-column>
          <el-table-column
            label="创建时间"
            align="center"
            prop="createtime"
          ></el-table-column>
          <el-table-column label="扣款状态" align="center" prop="k_status">
            <template slot-scope="{ row }">
              <div
                :style="{
                  color: row.k_status != 0 ? '#67C23A' : '',
                }"
              >
                {{
                  row.k_status == 0
                    ? "未付款"
                    : row.k_status == 1
                    ? "已付款"
                    : row.k_status == 2
                    ? "已抵扣"
                    : ""
                }}
              </div>
            </template>
          </el-table-column>
          <el-table-column
            label="审核时间"
            align="center"
            prop="examinetime"
          ></el-table-column>
          <el-table-column label="审核状态" align="center" prop="status">
            <template slot-scope="{ row }">
              <div
                :style="{
                  color:
                    row.status == 1 ? '#67C23A' : row.status == 2 ? 'red' : '',
                }"
              >
                {{
                  row.status == 0
                    ? "未审核"
                    : row.status == 1
                    ? "通过"
                    : row.status == 2
                    ? "拒绝"
                    : ""
                }}
              </div>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  postAdminPricingGetEmbroideryContract,
  postAdminPricingSubmitPricingContract,
  postAdminPricingAbandonedPricingContract,
  postAdminPricingExaminePricingContract,
  postAdminPricingAddFineAmount,
  postAdminPricingGetTypenoList,
  postAdminPricingAddAdditionalAmount,
  postAdminPricingGetReason,
  postAdminPricingGetPurposen,
  postAdminPricingLookPricingContract,
  postAdminPricingAddAdvanceAmount,
  uploadHomeApiupload,
  postAdminPricingAddWorkingProcedure,
  postAdminPricingGetAdvanceAmountList,
  postAdminPricingGetFineAmountList,
  postAdminPricingGetAdditionalAmountList,
  postAdminPricingGetWorkingProcedure,
  postAdminPricingLookpdf,
  postHomeCodeGetFactory,
} from "@/api";
import pagination from "@/components/pagination.vue";
export default {
  components: { pagination },
  filters: {
    detailTilte(val) {
      return [
        "预付款详情",
        "违约金/赔偿金详情",
        "额外费用详情",
        "工序加工费详情",
      ][val];
    },
  },
  data() {
    var validateNumber = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请输入税率"));
      } else if (value < 0) {
        callback(new Error("税率不能小于0"));
      } else {
        callback();
      }
    };
    var validateImage = (rule, value, callback) => {
      if (value.length) {
        callback();
      } else {
        callback(new Error("请上传凭证"));
      }
    };
    return {
      qxobj:{},
      radio: "",
      loading: false,
      detaillistdialogVisible: false, // 各类详情
      auditdialogVisible: false, // 审核
      penaltydialogVisible: false, // 违约金/赔偿金
      extradialogVisible: false, //额外费用
      imprestdialogVisible: false, // 预付款
      workingProceduredialogVisible: false, // 加工费用
      contracttypenolist: [], // 合同款号列表
      mouseIndex: -1,
      optionsgenerate: [
        {
          value: 0,
          label: "未生成",
        },
        {
          value: 1,
          label: "已生成",
        },
      ],
      options: [
        {
          value: 0,
          label: "未提交",
        },
        {
          value: 1,
          label: "未审核",
        },
        {
          value: 2,
          label: "通过",
        },
        {
          value: 3,
          label: "拒绝",
        },
        {
          value: 4,
          label: "作废",
        },
      ],
      form: {
        factory_name: "",
        sku_code: "",
        factory_contract_no: "",
        status: "",
        s_status: "",
        page: 1,
        size: 10,
      },
      // 审核
      auditForm: {
        id: "",
        status: 1,
      },
      // 违约金/赔偿金
      reasonList: [], // 违约金/赔偿金原因列表
      penaltyForm: {
        type: 1,
        factory_contract_no: "",
        type_no: "",
        reason: "",
        amount: "",
        remarks: "",
        is_factory: 1,
      },
      rulespenaltyForm: {
        type_no: [{ required: true, message: "请选择款号", trigger: "blur" }],
        reason: [
          {
            required: true,
            message: "请选择违约金/赔偿金原因",
            trigger: "blur",
          },
        ],
        amount: [
          {
            required: true,
            message: "请输入违约金/赔偿金金额",
            trigger: "blur",
          },
        ],
        remarks: [
          {
            required: true,
            message: "请输入违约金/赔偿金备注",
            trigger: "blur",
          },
        ],
      },
      // 额外费用
      purposenList: [], // 额外费用用途
      extraForm: {
        factory_contract_no: "",
        type_no: "",
        product_name: "",
        purpose: "",
        price: "",
        tax_rate: "",
        num: "",
        remarks: "",
        amount: "",
        images: [],
        is_factory: 1,
      },
      file: [],
      rulesextraForm: {
        type_no: [{ required: true, message: "请选择款号", trigger: "blur" }],
        purpose: [{ required: true, message: "请选择用途", trigger: "blur" }],
        price: [{ required: true, message: "请输入单价", trigger: "blur" }],
        num: [{ required: true, message: "请输入数量", trigger: "blur" }],
        remarks: [{ required: true, message: "请输入备注", trigger: "blur" }],
        images: [{ required: true, validator: validateImage, trigger: "blur" }],
        tax_rate: [
          { required: true, validator: validateNumber, trigger: "blur" },
        ],
      },
      // 预付款申请
      imprestForm: {
        is_factory: 1,
      },
      // 工序费用
      workingProcedureForm: {
        type: 1,
        factory_contract_no: "",
        type_no: "",
        delivery_date: "",
        price: "",
        num: "",
        amount: 0,
        supplier_id: "",
        is_factory: 1,
      },
      rulesworkingProcedureForm: {
        factory_contract_no: [
          { required: true, message: "请输入合同号", trigger: "blur" },
        ],
        type_no: [{ required: true, message: "请选择款号", trigger: "blur" }],
        price: [{ required: true, message: "请输入单价", trigger: "blur" }],
        num: [{ required: true, message: "请输入数量", trigger: "blur" }],
        delivery_date: [
          { required: true, message: "请选择交期", trigger: "blur" },
        ],
        supplier_id: [
          { required: true, message: "请选择工厂", trigger: "blur" },
        ],
      },
      tableData: [],
      detaillisttableData: [],
      detaillistype: "",
      total: 1,
    };
  },
  activated() {
    let form = this.form;
    this.qxobj = JSON.parse(this.$route.query.qxobj)
    this.postAdminPricingGetEmbroideryContract(form);
    this.postAdminPricingGetReason();
    this.postAdminPricingGetPurposen();
    this.postHomeCodeGetFactory();
  },
  methods: {
    // 加工厂列表
    postHomeCodeGetFactory() {
      let obj = {
        type: 2,
        page: 1,
        size: 1000,
      };
      postHomeCodeGetFactory(obj).then((res) => {
        this.factoryList = res.data;
      });
    },
    enter(index) {
      this.mouseIndex = index;
    },
    leave() {
      this.mouseIndex = -1;
    },
    onDelete(index) {
      let images = this.extraForm.images;
      let file = this.file;
      images.splice(index, 1);
      file.splice(index, 1);
      this.extraForm.images = images;
      this.file = file;
    },
    onLookContract(fileid) {
      let obj = {
        fileid,
      };
      postAdminPricingLookpdf(obj).then((res) => {
        console.log("合同----》", res);
        window.open(res.data.downloadUrl);
      });
      // window.open(url);
    },
    async onDetailList(factory_contract_no, type) {
      let obj = {
        factory_contract_no,
        status: 1,
        page: 1,
        size: 1000,
      };
      this.detaillistype = type;
      if (type == 0) {
        await this.postAdminPricingGetAdvanceAmountList(obj);
        this.detaillistdialogVisible = true;
        return;
      }
      if (type == 1) {
        await this.postAdminPricingGetFineAmountList(obj);
        this.detaillistdialogVisible = true;
        return;
      }
      if (type == 2) {
        await this.postAdminPricingGetAdditionalAmountList(obj);
        this.detaillistdialogVisible = true;
        return;
      }
      if (type == 3) {
        await this.postAdminPricingGetWorkingProcedure(obj);
        this.detaillistdialogVisible = true;
        return;
      }
    },
    // 预付款列表
    async postAdminPricingGetAdvanceAmountList(data) {
      this.loading = true;
      this.form = data;
      await postAdminPricingGetAdvanceAmountList(data)
        .then((res) => {
          this.loading = false;
          console.log("预付款列表", res);
          this.detaillisttableData = res.data;
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    // 违约金/赔偿金列表
    async postAdminPricingGetFineAmountList(data) {
      this.loading = true;
      this.form = data;
      await postAdminPricingGetFineAmountList(data)
        .then((res) => {
          this.loading = false;
          console.log("预付款列表", res);
          this.detaillisttableData = res.data;
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    // 额外费用列表
    async postAdminPricingGetAdditionalAmountList(data) {
      this.loading = true;
      this.form = data;
      await postAdminPricingGetAdditionalAmountList(data)
        .then((res) => {
          this.loading = false;
          console.log("预付款列表", res);
          this.detaillisttableData = res.data;
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    // 工序加工费列表
    async postAdminPricingGetWorkingProcedure(data) {
      this.loading = true;
      this.form = data;
      await postAdminPricingGetWorkingProcedure(data)
        .then((res) => {
          this.loading = false;
          console.log("预付款列表", res);
          this.detaillisttableData = res.data;
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    onChangeType(e, type) {
      if (type == 1) {
        this.extraForm.type_no = e.type_no;
        this.extraForm.product_name = e.type_name;
      } else if (type == 2) {
        this.workingProcedureForm.type_no = e.type_no;
      }
    },
    // 获取用途
    postAdminPricingGetPurposen() {
      postAdminPricingGetPurposen().then((res) => {
        this.purposenList = res.data;
      });
    },
    // 违约金/赔偿金原因
    postAdminPricingGetReason() {
      postAdminPricingGetReason().then((res) => {
        this.reasonList = res.data;
      });
    },
    // 合同款号列表
    postAdminPricingGetTypenoList(obj) {
      postAdminPricingGetTypenoList(obj).then((res) => {
        this.contracttypenolist = res.data;
      });
    },
    beforeAvatarUpload(file) {
      let images = this.extraForm.images;
      let files = this.file;
      files.push(file);
      this.file = files;
      let reader = new FileReader();
      reader.readAsDataURL(file);
      reader.onload = () => {
        let _base64 = reader.result;
        images.push(_base64);
        this.extraForm.images = images;
      };
      return false;
    },
    // 查看
    onLook(id) {
      this.$router.push({ name: "Contractdetail", query: { id } });
    },
    // 提交工序费用
    onWorkingProcedureAffirm(formName) {
      this.loading = true
      let that = this;
      let obj = this.workingProcedureForm;
      let form = this.form;
      this.$refs[formName].validate(async (valid) => {
        if (valid) {
          postAdminPricingAddWorkingProcedure(obj).then((res) => {
            that.postAdminPricingGetEmbroideryContract(form);
            that.$message({
              type: "success",
              message: `工序费用提交成功!`,
            });
            that.workingProceduredialogVisible = false;
            this.loading = false
          });
        } else {
          console.log("error submit!!");
          this.loading = false
          return false;
        }
      });
    },
    // 预付款
    onImprest(e) {
      let obj = {
        id: e.id,
        is_factory: 1,
      };
      postAdminPricingLookPricingContract(obj).then((res) => {
        this.imprestForm = res.data;
        this.imprestdialogVisible = true;
      });
    },
    // 提交预付款
    onImprestAffirm() {
      this.loading = true
      let obj = {
        factory_contract_no: this.imprestForm.factory_contract_no,
        is_factory: 1,
      };
      postAdminPricingAddAdvanceAmount(obj).then((res) => {
        this.$message.success("提交成功");
        this.imprestdialogVisible = false;
        this.loading = false
      }).catch(err=>{
        this.loading = false
      });
    },
    // 工序
    onWorkingProcedure(e) {
      this.workingProcedureForm = {
        factory_contract_no: "",
        type_no: "",
        delivery_date: "",
        price: "",
        num: "",
        amount: 0,
        type: 1,
        is_factory: 1,
      };
      let obj = {
        factory_contract_no: e.factory_contract_no,
        type: 1,
      };
      this.workingProcedureForm.factory_contract_no = e.factory_contract_no;
      this.postAdminPricingGetTypenoList(obj);
      this.workingProceduredialogVisible = true;
    },
    //  额外费用
    onExtra(e) {
      this.extraForm = {
        factory_contract_no: "",
        type_no: "",
        product_name: "",
        purpose: "",
        price: "",
        tax_rate: "",
        num: "",
        remarks: "",
        amount: "",
        images: [],
        is_factory: 1,
      };
      this.file = [];
      let obj = {
        factory_contract_no: e.factory_contract_no,
        type: 1,
      };
      this.extraForm.factory_contract_no = e.factory_contract_no;
      this.postAdminPricingGetTypenoList(obj);
      this.extradialogVisible = true;
    },
    // 提交额外费用
    onExtraAffirm(formName) {
      this.loading = false
      let that = this;
      let obj = this.extraForm;
      let form = this.form;
      this.$refs[formName].validate(async (valid) => {
        if (valid) {
          for (let index = 0; index < that.file.length; index++) {
            let http = obj.images[index].substring(0, 4);
            if (http != "http") {
              await uploadHomeApiupload(that.file[index]).then((res) => {
                console.log("图片");
                obj.images[index] = res.img;
              });
            }
          }

          postAdminPricingAddAdditionalAmount(obj).then((res) => {
            that.postAdminPricingGetEmbroideryContract(form);
            that.$message({
              type: "success",
              message: `额外费用提交成功!`,
            });
            that.extradialogVisible = false;
            this.loading = false
          }).catch(err=>{
            this.loading = false
          });
        } else {
          console.log("error submit!!");
          this.loading = false
          return false;
        }
      });
    },
    onChangePrice(type) {
      if (type == 1) {
        let extraForm = this.extraForm;
        if (extraForm.num && extraForm.price && extraForm.tax_rate) {
          extraForm.amount = (
            Number(extraForm.price) *
            Number(extraForm.num) *
            ((Number(extraForm.tax_rate) + 100) / 100)
          ).toFixed(2);
        } else {
          extraForm.amount = 0;
        }
      } else if (type == 2) {
        let workingProcedureForm = this.workingProcedureForm;
        if (workingProcedureForm.num && workingProcedureForm.price) {
          workingProcedureForm.amount = (
            Number(workingProcedureForm.price) *
            Number(workingProcedureForm.num)
          ).toFixed(2);
        } else {
          workingProcedureForm.amount = 0;
        }
      }
    },
    // 违约金/赔偿金
    onPenalty(e) {
      this.reasonList = []; // 违约金/赔偿金原因列表
      this.penaltyForm = {
        type: 1,
        factory_contract_no: "",
        type_no: "",
        reason: "",
        amount: "",
        remarks: "",
        is_factory: 1,
      };
      let obj = {
        factory_contract_no: e.factory_contract_no,
        type: 1,
      };
      this.penaltyForm.factory_contract_no = e.factory_contract_no;
      this.postAdminPricingGetReason();
      this.postAdminPricingGetTypenoList(obj);
      this.penaltydialogVisible = true;
    },
    // 提交违约金/赔偿金
    onPenaltyAffirm(formName) {
      this.loading = true
      let that = this;
      let obj = this.penaltyForm;
      let form = this.form;
      this.$refs[formName].validate((valid) => {
        if (valid) {
          postAdminPricingAddFineAmount(obj).then((res) => {
            that.postAdminPricingGetEmbroideryContract(form);
            that.$message({
              type: "success",
              message: `违约金/赔偿金提交成功!`,
            });
            that.penaltydialogVisible = false;
            this.loading = false
          }).catch(err=>{
            this.loading = false
          });
        } else {
          console.log("error submit!!");
          this.loading = false
          return false;
        }
      });
    },
    //   审核
    onAudit(e) {
      this.auditForm.id = e.id;
      this.auditdialogVisible = true;
    },
    // 提交审核
    onAuditAffirm() {
      let that = this;
      let obj = this.auditForm;
      let form = this.form;
      postAdminPricingExaminePricingContract(obj).then((res) => {
        that.postAdminPricingGetEmbroideryContract(form);
        that.$message({
          type: "success",
          message: `审核${obj.status == 1 ? "通过" : "不通过"}!`,
        });
        that.auditdialogVisible = false;
      });
    },
    // 提交
    onSubmit(e) {
      let that = this;
      let form = this.form;
      this.$confirm(
        `提交编号${e.factory_contract_no}合同后将无法撤回，确定提交？`,
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      )
        .then(() => {
          let obj = {
            id: e.id,
          };
          postAdminPricingSubmitPricingContract(obj).then((res) => {
            that.postAdminPricingGetEmbroideryContract(form);
            this.$message({
              type: "success",
              message: "提交成功!",
            });
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消提交",
          });
        });
    },
    //  作废
    onCancellation(e) {
      let that = this;
      let form = this.form;

      this.$confirm(`确定作废编号为${e.factory_contract_no}的合同？`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let obj = {
            id: e.id,
          };
          postAdminPricingAbandonedPricingContract(obj).then((res) => {
            that.postAdminPricingGetEmbroideryContract(form);
            this.$message({
              type: "success",
              message: "作废成功!",
            });
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消作废",
          });
        });
    },
    // 合同列表
    async postAdminPricingGetEmbroideryContract(data) {
      this.loading = true;
      this.form = data;
      postAdminPricingGetEmbroideryContract(data)
        .then((res) => {
          this.loading = false;
          console.log("合同列表", res);
          this.tableData = res.data;
          this.total = Number(res.total);
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    // 搜索
    onSearch() {
      this.form.page = 1;
      this.form.size = 10;
      this.postAdminPricingGetEmbroideryContract(this.form);
    },
  },
};
</script>

<style lang="scss" scoped>
.myform {
  display: flex;
  justify-content: space-between;
  > div {
    display: flex;
  }
  &-item {
    margin-right: 10px;
  }
}
.avatar-uploader-list {
  display: flex;
  flex-wrap: wrap;
  .avatar-uploader-list-image {
    width: 178px;
    height: 178px;
    display: block;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 6px;
  }
  .avatar-uploader-list-div {
    position: relative;
    .avatar-uploader-list-div-shade {
      display: flex;
      align-items: center;
      justify-content: center;
      position: absolute;
      width: 178px;
      height: 178px;
      top: 0;
      left: 0;
      background: rgba($color: #000000, $alpha: 0.5);
    }
  }
  > div {
    display: flex;
    flex-wrap: wrap;
  }
}
.WorkingSchedule {
  background: #ffff;
  padding: 20px;
  border-radius: 2px;
  @include boxShadow;
}
</style>
